$(function() {
//时间控件
	var start1 = {
        elem: "#bdate1",
        format: 'YYYY-MM-DD',
        max: '2099-06-16 23:59:59',
        istime: false,
        istoday: false,
        choose: function(datas) {
            end1.min = datas; //开始日选好后，重置结束日的最小日期
            end1.start = datas //将结束日的初始值设定为开始日
        }
    };
    var end1 = {
        elem: '#fdate1',
        format: 'YYYY-MM-DD',
        //	  min: laydate.now(),
        max: '2099-06-16 23:59:59',
        istime: false,
        istoday: false,
        choose: function(datas) {
            start1.max = datas; //结束日选好后，重置开始日的最大日期
        }
    };
    laydate(start1);
    laydate(end1);
    var start2 = {
        elem: "#bdate2",
        format: 'YYYY-MM-DD',
        max: '2099-06-16 23:59:59',
        istime: false,
        istoday: false,
        choose: function(datas) {
            end2.min = datas; //开始日选好后，重置结束日的最小日期
            end2.start = datas //将结束日的初始值设定为开始日
        }
    };
    var end2 = {
        elem: '#fdate2',
        format: 'YYYY-MM-DD',
        //	  min: laydate.now(),
        max: '2099-06-16 23:59:59',
        istime: false,
        istoday: false,
        choose: function(datas) {
            start2.max = datas; //结束日选好后，重置开始日的最大日期
        }
    };
    laydate(start2);
    laydate(end2);
    var start3 = {
        elem: "#bdate3",
        format: 'YYYY-MM-DD',
        max: '2099-06-16 23:59:59',
        istime: false,
        istoday: false,
        choose: function(datas) {
            end3.min = datas; //开始日选好后，重置结束日的最小日期
            end3.start = datas //将结束日的初始值设定为开始日
        }
    };
    var end3 = {
        elem: '#fdate3',
        format: 'YYYY-MM-DD',
        //	  min: laydate.now(),
        max: '2099-06-16 23:59:59',
        istime: false,
        istoday: false,
        choose: function(datas) {
            start3.max = datas; //结束日选好后，重置开始日的最大日期
        }
    };
    laydate(start3);
    laydate(end3);
    var start4 = {
        elem: "#bdate4",
        format: 'YYYY-MM-DD',
        max: '2099-06-16 23:59:59',
        istime: false,
        istoday: false,
        choose: function(datas) {
            end4.min = datas; //开始日选好后，重置结束日的最小日期
            end4.start = datas //将结束日的初始值设定为开始日
        }
    };
    var end4 = {
        elem: '#fdate4',
        format: 'YYYY-MM-DD',
        //	  min: laydate.now(),
        max: '2099-06-16 23:59:59',
        istime: false,
        istoday: false,
        choose: function(datas) {
            start4.max = datas; //结束日选好后，重置开始日的最大日期
        }
    };
    laydate(start4);
    laydate(end4);
	var mychart = echarts.init(document.getElementById("inspection-pie"));
	mychart.setOption({
		tooltip: {
			trigger: 'item',
			formatter: "{a} <br/>{b}: {c} ({d}%)"
		},
		legend: {
			orient: 'horizontal',
			bottom:"10px",
//			x: 'center',
			itemWidth:8,
			data: [{
				name:'正常',
				icon:'circle'
			},{
				name:'异常',
				icon:'circle'
			},{
				name:'严重',
				icon:'circle'
			}]
		},
		series: [{
			name: '点巡检',
			type: 'pie',
			radius: ['50%', '80%'],
			center:['50%','40%'],
			avoidLabelOverlap: false,
			label: {
				normal: {
					show: true,
					position: 'inside',//内部显示
					formatter:function(param){
						return Math.round(param.percent)+"%";//取整数
					},
				}
			},
			labelLine: {
				normal: {
					show: false
				}
			},
			data: [{
					value: 335,
					name: '正常'
				},
				{
					value: 310,
					name: '异常'
				},
				{
					value: 234,
					name: '严重'
				}
			],
			color:[
				"#56c0a6","#f98b4b","#f74d4c"
			]
		}]
	});
	var mychart2 = echarts.init(document.getElementById("inspection-bar"));
	mychart2.setOption({
		title: {
        text: ''
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: { // 坐标轴指示器，坐标轴触发有效
            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    legend: {
        data: ['正常', '异常', '严重'],
        align: 'right',
        right: 20,
        itemHeight:8
    },
    grid: {
        left: '3%',
        right: '3%',
        bottom: '10%',
        top:'10%',
        containLabel: true
    },
    xAxis: [{
        type: 'category',
        data: ['克拉玛依', '长春', '库车', '酒泉', '汉川','肇庆','荥阳', '九江', '石嘴山', '沈阳', '兰州','宿州','延吉', '蚌埠', '大连', '布连', '福州','定州','白城', '长春', '霍州', '泉州', '天津','陕西恒源','陕西亚煤','宝鸡','咸阳','渭南','铜川','西安','杨陵区','汉中','安康'],
        axisLabel: {
				formatter: function(params) {
					var newParamsName = "";
					var paramsNameNumber = params.length;
					var provideNumber = 1;
					var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
					if(paramsNameNumber > provideNumber) {
						for(var p = 0; p < rowNumber; p++) {
							var tempStr = "";
							var start = p * provideNumber;
							var end = start + provideNumber;
							if(p == rowNumber - 1) {
								tempStr = params.substring(start, paramsNameNumber);
							} else {
								tempStr = params.substring(start, end) + "\n";
							}
							newParamsName += tempStr;
						}

					} else {
						newParamsName = params;
					}
					return newParamsName
				},
			}
    }],
    yAxis: [{
        type: 'value',
        name: '',
        axisLabel: {
            formatter: '{value}'
        }
    }],
        dataZoom: [
        {
            "show": true, 
            "height": 20, 
            "xAxisIndex": [
                0
            ], 
            bottom:5,
            "start": 0, 
            "end": 100
        }, 
    ], 
    series: [{
        name: '正常',
        type: 'bar',
        data: [20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31]
    }, {
        name: '异常',
        type: 'bar',
        data: [10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5]
    }, {
        name: '严重',
        type: 'bar',
        data: [1, 1, 2, 3, 1,1, 1, 2, 3, 1,1, 1, 2, 3, 1,1, 1, 2, 3, 1,1, 1, 2, 3, 1,1, 1, 2, 3, 1,1, 1, 2]
    }],
    color:["#56c0a6","#f98b4b","#f74d4c"],
    animationDuration: function (idx) {
    // 越往后的数据延迟越大
    return idx * 100;
}
	});
	var mychart2 = echarts.init(document.getElementById('workTicket'));
	mychart2.setOption({
		title: {
        text: ''
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: { // 坐标轴指示器，坐标轴触发有效
            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    legend: {
        data: ['已完成', '进行中'],
        align: 'right',
        right: 20,
        itemHeight:8
    },
    grid: {
        left: '3%',
        right: '3%',
        bottom: '10%',
        top:'10%',
        containLabel: true
    },
    xAxis: [{
        type: 'category',
        data: ['克拉玛依', '长春', '库车', '酒泉', '汉川','肇庆','荥阳', '九江', '石嘴山', '沈阳', '兰州','宿州','延吉', '蚌埠', '大连', '布连', '福州','定州','白城', '长春', '霍州', '泉州', '天津','陕西恒源','陕西亚煤','宝鸡','咸阳','渭南','铜川','西安','杨陵区','汉中','安康'],
        axisLabel: {
				formatter: function(params) {
					var newParamsName = "";
					var paramsNameNumber = params.length;
					var provideNumber = 1;
					var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
					if(paramsNameNumber > provideNumber) {
						for(var p = 0; p < rowNumber; p++) {
							var tempStr = "";
							var start = p * provideNumber;
							var end = start + provideNumber;
							if(p == rowNumber - 1) {
								tempStr = params.substring(start, paramsNameNumber);
							} else {
								tempStr = params.substring(start, end) + "\n";
							}
							newParamsName += tempStr;
						}

					} else {
						newParamsName = params;
					}
					return newParamsName
				},
			}
    }],
    yAxis: [{
        type: 'value',
        name: '',
        axisLabel: {
            formatter: '{value}'
        }
    }],
        dataZoom: [
        {
            "show": true, 
            "height": 20, 
            "xAxisIndex": [
                0
            ], 
            bottom:5,
            "start": 0, 
            "end": 100
        }, 
    ], 
    series: [{
        name: '已完成',
        type: 'bar',
        data: [20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31],
        barMaxWidth:'8px'
    }, {
        name: '进行中',
        type: 'bar',
        data: [10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5],
        barMaxWidth:'8px'
    }],
    color:["#56c0a6","#f28542"]
	});
	var mychart3 = echarts.init(document.getElementById('operation'));
	mychart3.setOption({
		title: {
        text: ''
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: { // 坐标轴指示器，坐标轴触发有效
            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    legend: {
        data: ['已完成', '进行中'],
        align: 'right',
        right: 20,
        itemHeight:8
    },
    grid: {
        left: '3%',
        right: '3%',
        bottom: '10%',
        top:'10%',
        containLabel: true
    },
    xAxis: [{
        type: 'category',
        data: ['克拉玛依', '长春', '库车', '酒泉', '汉川','肇庆','荥阳', '九江', '石嘴山', '沈阳', '兰州','宿州','延吉', '蚌埠', '大连', '布连', '福州','定州','白城', '长春', '霍州', '泉州', '天津','陕西恒源','陕西亚煤','宝鸡','咸阳','渭南','铜川','西安','杨陵区','汉中','安康'],
        axisLabel: {
				formatter: function(params) {
					var newParamsName = "";
					var paramsNameNumber = params.length;
					var provideNumber = 1;
					var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
					if(paramsNameNumber > provideNumber) {
						for(var p = 0; p < rowNumber; p++) {
							var tempStr = "";
							var start = p * provideNumber;
							var end = start + provideNumber;
							if(p == rowNumber - 1) {
								tempStr = params.substring(start, paramsNameNumber);
							} else {
								tempStr = params.substring(start, end) + "\n";
							}
							newParamsName += tempStr;
						}

					} else {
						newParamsName = params;
					}
					return newParamsName
				},
			}
    }],
    yAxis: [{
        type: 'value',
        name: '',
        axisLabel: {
            formatter: '{value}'
        }
    }],
        dataZoom: [
        {
            "show": true, 
            "height": 20, 
            "xAxisIndex": [
                0
            ], 
            bottom:5,
            "start": 0, 
            "end": 100
        }, 
    ], 
    series: [{
        name: '已完成',
        type: 'bar',
        data: [20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31],
        barMaxWidth:'8px'
    }, {
        name: '进行中',
        type: 'bar',
        data: [10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5],
        barMaxWidth:'8px'
    }],
    color:["#56c0a6","#f98b4b","#f74d4c"]
	});
	var mychart4 = echarts.init(document.getElementById('regular'));
	mychart4.setOption({
		title: {
        text: ''
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: { // 坐标轴指示器，坐标轴触发有效
            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    legend: {
        data: ['已完成', '进行中'],
        align: 'right',
        right: 20,
        itemHeight:8
    },
    grid: {
        left: '3%',
        right: '3%',
        bottom: '10%',
        top:'10%',
        containLabel: true
    },
    xAxis: [{
        type: 'category',
        data: ['克拉玛依', '长春', '库车', '酒泉', '汉川','肇庆','荥阳', '九江', '石嘴山', '沈阳', '兰州','宿州','延吉', '蚌埠', '大连', '布连', '福州','定州','白城', '长春', '霍州', '泉州', '天津','陕西恒源','陕西亚煤','宝鸡','咸阳','渭南','铜川','西安','杨陵区','汉中','安康'],
        axisLabel: {
				formatter: function(params) {
					var newParamsName = "";
					var paramsNameNumber = params.length;
					var provideNumber = 1;
					var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
					if(paramsNameNumber > provideNumber) {
						for(var p = 0; p < rowNumber; p++) {
							var tempStr = "";
							var start = p * provideNumber;
							var end = start + provideNumber;
							if(p == rowNumber - 1) {
								tempStr = params.substring(start, paramsNameNumber);
							} else {
								tempStr = params.substring(start, end) + "\n";
							}
							newParamsName += tempStr;
						}

					} else {
						newParamsName = params;
					}
					return newParamsName
				},
			}
    }],
    yAxis: [{
        type: 'value',
        name: '',
        axisLabel: {
            formatter: '{value}'
        }
    }],
    dataZoom: [
        {
            "show": true, 
            "height": 20, 
            "xAxisIndex": [
                0
            ], 
            bottom:5,
            "start": 0, 
            "end": 100
        }, 
    ], 
    series: [{
        name: '已完成',
        type: 'bar',
        data: [20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31, 34, 31,20, 12, 31],
        barMaxWidth:'8px'
    }, {
        name: '进行中',
        type: 'bar',
        data: [10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5, 9, 3,10, 20, 5],
        barMaxWidth:'8px'
    }],
    color:["#56c0a6","#f98b4b","#f74d4c"]
	});
	
})